<template>
	<view class="final-score">
		<uni-section :title="key+'号玩家'" v-for="(score,key,index) in playerScoreMap" :key="index" type="line"
			class="gameresult-info" padding>
			<view class="action-text">
				<text class="action-text score-highlight">最终得分：<text 
						 :class="[score.finalScore>0?'plus':'minus']">{{score.finalScore}}</text>
						 </text>		 
				<uni-tag :text="seatTransAndCls[currentGameDTO.players[key].gameRole.code].trans"
					:type="seatTransAndCls[currentGameDTO.players[key].gameRole.code].type" />		 
			</view>
			<uni-collapse-item title="详细得分:">
				<view class="score-item" v-for="(item,index) in score.items" :key="index">
					<text class="action-text  score-highlight">{{item.reason}}</text>
					<text class="action-text "
						:class="[item.score>0?'plus':'minus']">{{item.score}}</text>
				</view>
			</uni-collapse-item>
		</uni-section>
	</view>
</template>

<script>
	import {mapState,mapMutations,mapGetters,mapActions} from "@/store/helper/dm"
	export default {
		data() {
			return {
				seatTransAndCls:{
					'bc':{trans:'白痴',type:"success"},
					'cupid':{trans:'丘比特',type:"success"} ,
					'guarder':{trans:'守卫',type:"success"} ,
					'hunter':{trans:'猎人',type:"success"},
					'seer':{trans:'预言家',type:"success"},
					'villager':{trans:'平民',type:"primary"},
					'werewolf':{trans:'狼人',type:"error"},
					'white_wolf_king':{trans:'白狼王',type:"error"},
					'witch':{trans:'女巫',type:"success"},
					'wolf_beauty':{trans:'狼美人',type:"warning"},
					'wolf_king':  {trans:'狼王',type:"error"},
					'null': {trans:'未录入',type:"primary"}
					}
			};
		},
		computed: {
			...mapState([
				"user",
				"gameStatus",
				"currentGameDTO",
				"gameStageCode",
				"gameResult",
				"playerScoreMap"
			])
		}
	};
</script>

<style scoped lang="scss">
	.action-text {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		flex-wrap: wrap;
		flex: 1;
		margin: 5px;
		color: #6a6a6a;
		font-size: 14px;
	}
	.uni-collapse-item{
		font-weight: 700;
	}
	

	.score-item {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-wrap: wrap;
	}

	.score-highlight {
		color: $uni-color-primary;
		font-weight: 700;
	}
	
	.plus {
		color: $uni-color-success;
	}
	
	.minus {
		color: $uni-color-error;
	}
</style>
